<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="http://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>
<script src="http://documentcloud.github.com/underscore/underscore.js" type="text/javascript"></script>
<script src="http://documentcloud.github.com/backbone/backbone.js" type="text/javascript"></script>
<style>
* {
  padding: 0;
  margin: 0;
}
li {
  list-style: none;
}
</style>
</head>
<body>
<div><a href="#help">help</a><a href="#search/jkdjdksl">search</a></div>
<ul id="wrap">

</ul>
<script>
//Template `list`
var list = '<% _.each(people, function(name) { %> <li><%= name %></li> <% }); %>';

var TestView = Backbone.View.extend({
  
  //Template
  template: _.template(list),

  render: function() {
    $("#wrap").html(this.template({people : ['Home', 'about', 'contact']}));
  }

});
var Test_View = new TestView;
Test_View.render();

var WorkspaceRouter = Backbone.Router.extend({

  routes: {
    "help":                 "help",    // #help
    "search/:query":        "search",  // #search/kiwis
    "search/:query/:page":  "search"   // #search/kiwis/p7
  },

  help: function() {
    console.log("help");
  },


  search: function(query, page) {
    console.log(query);
  },
  routePath: function(path) {
      // Remove leading and trailing /
      if (path.charAt(0) == '/') {
          path = path.slice(1);
      }
      if (path.charAt(path.length - 1) == '/') {
          path = path.slice(0, path.length - 1);
      }
      // Route it!
      this.navigate(path, true);
      return false;
  }

});
  new WorkspaceRouter();
  Backbone.history.start()
var initialPath = '/';
WorkspaceRouter.router.routePath(initialPath);
</script>
</body>
</html>